// 要使用的layui模块
layui.use(['layer', 'form', 'table', 'laydate', 'element'], function(){
    var layer = layui.layer; // 获得layer模块
    var form = layui.form; // 获得form模块
    var table = layui.table; // 获得table模块
    var laydate = layui.laydate; // 获得laydate模块
    var element = layui.element; // 获得element模块（和导航、tab等有关）
    var $ = layui.$; // 调用JQuery方法时
    var laytpl = layui.laytpl;
	var empsoftdel = layui.empsoftdel; // 获取自己封装的ajax模块
	
    //第一个实例
    table.render({
        elem: '#test' // 给table设置id或class，方便layui调用该元素
        ,height: 'full-50' // 窗口高度-100
        ,url: 'http://localhost:9000/statistical/freightrank/moneyfreightlay' // 数据接口
        // ,method: 'post' //如果无需自定义HTTP类型，可不加该参数
        ,page: true // 开启分页
        ,limit: 10 // 默认页大小
        ,limits: [10,20,30,50,100] //自定义可选分页大小
        ,cellMinWidth: 80 // 全局定义常规单元格的最小宽度，layui 2.2.1 新增
        ,skin: 'line' // 行边框风格
        // ,even: true // 开启隔行背景
        // ,size: 'sm' // 小尺寸的表格
        ,totalRow: true // 开启合计功能
        ,toolbar: '#toolbarDemo' //开启头部工具栏，并为其绑定左侧模板
        //自定义头部工具栏右侧图标。如无需自定义，去除该参数即可
        ,defaultToolbar: ['filter', 'exports', 'print', { // 列过滤、导出按钮、打印按钮
            title: '提示'
            ,layEvent: 'LAYTABLE_TIPS'
            ,icon: 'layui-icon-tips'
        }]
        ,title: '代收结算表'// 表名
        // 列信息
        ,cols: [[ //表头
            {type:'radio', fixed: 'left'} // 开启单选框
            // {type: 'checkbox', fixed: 'left'}// 开启复选框
			,{ field: 'rank', title: '序号', width: 80, fixed: 'left', templet: '#rank', totalRowText: '合计' }
            ,{field: 'name', title: '姓名', sort: true,  align: 'center'}
            ,{field: 'reduceFund', title: '减款',sort: true,  totalRow: true, align: 'center'}
            ,{field: 'payKickback', title: '付回扣',sort: true,  totalRow: true, align: 'center'}
			,{field: 'moneyOfChangePay', title: '代收货款变更后金额',sort: true,  totalRow: true, align: 'center'}
			,{field: 'carryGoodsFee', title: '送货费',sort: true,  totalRow: true, align: 'center'}
			,{field: 'carriage', title: '运费', sort: true, totalRow: true, align: 'center'}
			,{field: 'insurance', title: '保险费',sort: true,  totalRow: true, align: 'center'}
            // ,{fixed: 'right', title:'操作', toolbar: '#barDemo', width:150, align: 'center'}
        ]]
    });



    // laydate时间模块，指定html的元素
    laydate.render({
        elem: '#balanceDate' // 指定元素
        ,range: true // 启用范围，或 range: '~' 来自定义分割字符，默认'-'
        ,format: 'yyyy-MM-dd HH:mm:ss'
        ,btns: ['clear', 'now', 'confirm']
        // ,theme: '#393D49'
        ,theme: 'grid'
    });
    // 查询用对象
    var MgrSettle = {
        tableId: "test",    //表格id
        condition: {
            customer: "",
            balanceDate: ""
        }
    };

    // 查询请求内容
    MgrSettle.search = function () {
        var queryData = {};
        queryData['year'] = $("#year").val();
        queryData['month'] = $("#month").val();
        table.reload(MgrSettle.tableId, {where: queryData});
    };
    // // 点击查询按钮
    // $('#btnSearch').click(function () {
    //     MgrSettle.search();
    // });


    // 服务器排序
    table.on('sort(test)', function(obj){ //注：sort 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
        // console.log(obj.field); //当前排序的字段名
        // console.log(obj.type); //当前排序类型：desc（降序）、asc（升序）、null（空对象，默认排序）
        // console.log(this); //当前排序的 th 对象

        //尽管我们的 table 自带排序功能，但并没有请求服务端。
        //有些时候，你可能需要根据当前排序的字段，重新向服务端发送请求，从而实现服务端排序，如：
        table.reload('test', {
            initSort: obj //记录初始排序，如果不设的话，将无法标记表头的排序状态。
            ,where: { //请求参数（注意：这里面的参数可任意定义，并非下面固定的格式）
                sidx: obj.field //排序字段
                ,sord: obj.type //排序方式
            }
        });
        // layer.msg('服务端排序。order by '+ obj.field + ' ' + obj.type);
    });



    // 监听行双击事件
    table.on('rowDouble(test)', function(obj){
        console.log(obj.tr) //得到当前行元素对象
        console.log(obj.data) //得到当前行数据
    });




    // 复选框监听
    table.on('checkbox(test)', function(obj){
        console.log(obj.checked); //当前是否选中状态
        console.log(obj.data); //选中行的相关数据
        console.log(obj.type); //如果触发的是全选，则为：all，如果触发的是单选，则为：one
    });

    //头工具栏事件
    table.on('toolbar(test)', function(obj){
        var checkStatus = table.checkStatus(obj.config.id);
        switch(obj.event){
			case 'search':
				MgrSettle.search();
				break;
        };
    });

    //监听工具条
    table.on('tool(test)', function(obj){
        var data = obj.data;
        if(obj.event === 'detail'){
            layer.msg('ID：'+ data.id + ' 的查看操作');
        } else if(obj.event === 'del'){
            layer.confirm('确认删除？', function(index){
                obj.del();
                layer.close(index);
				
				empsoftdel.ajax('http://localhost:9000/statistical/freightrank/delete', 'get', 'json', {
					"ciid": data.ciid
				}, function(res) {
					alert(res);
				});
				
            });
        } else if(obj.event === 'edit'){
            layer.alert('编辑行：<br>'+ JSON.stringify(data))
        }
    });
});
